﻿
@{
    ViewBag.Title = "Index";
}

<table id="dg_User" align="center"></table>
<div id="tb" style="padding:5px;height:auto">
    <div style="margin-bottom:5px">
        <a id="btn_Create" href="#" class="easyui-linkbutton" iconCls="icon-add">新增</a>
        <a id="btn_Edit" href="#" class="easyui-linkbutton" iconCls="icon-edit">修改</a>
        <a id="btn_Delete" href="#" class="easyui-linkbutton" iconCls="icon-remove">删除</a>
        @*<a href="#" class="easyui-linkbutton" iconCls="icon-lock">锁定/挂失</a>
            <a href="#" class="easyui-linkbutton" iconCls="icon1">用户转账</a>
            <a href="#" class="easyui-linkbutton" iconCls="icon-reload">用户换卡</a>
            <a href="#" class="easyui-linkbutton" iconCls="icon-reload">导出Excel</a>
            <a href="#" class="easyui-linkbutton" iconCls="icon2">导入Excel</a>*@
    </div>
    <div>
        <div>
            用户ID:<input id="txt_ID" type="text" class="easyui-textbox" />
            用户姓名:<input id="txt_userName" type="text" class="easyui-textbox" />
            手机号:<input id="txt_userPhone" type="text" class="easyui-textbox" />
            性别:
            <select id="sel_Sex">
                <option value="0">全部</option>
                <option value="1">男</option>
                <option value="2">女</option>
            </select>
            用户级别:
            @Html.DropDownList("Userlevel", ViewBag.UserlevelList as IEnumerable<SelectListItem>)
            <a href="#" id="btn_Search" class="easyui-linkbutton Search" iconCls="icon-search">查询</a>
        </div>
    </div>
</div>

@*对话框弹出*@
<div id="dlg" class="easyui-dialog" style="width:300px;height:250px;"
     data-options="iconCls:'icon-save',resizable:true,modal:true,closed: true">
    <iframe id="frm1" src="/UserInfo/Edit" width="99%" style="height:350px" frameborder="0"></iframe>
</div>

<script type="text/javascript">
    function createTime(v) {
        var date = new Date(parseInt(v.substr(6, 13)));
        var y = date.getFullYear();
        var m = date.getMonth() + 1;
        m = m < 10 ? '0' + m : m;
        var d = date.getDate();
        d = d < 10 ? ("0" + d) : d;
        var h = date.getHours();
        h = h < 10 ? ("0" + h) : h;
        var M = date.getMinutes();
        M = M < 10 ? ("0" + M) : M;
        var str = y + "-" + m + "-" + d + " " + h + ":" + M;
        return str;
    }

</script>

<script>
    $("#dg_User").datagrid({
        fitColumn: true,//使列自动展开/收缩到合适的DataGrid宽度。
        toolbar: "#tb",//toolbar:通过选择器指定的工具栏。
        pagination: true,//pagination:如果为true，则在DataGrid控件底部显示分页工具栏。
        fit: true,//fit:当设置为true的时候面板大小将自适应父容器。
        singleSelect: true,//当设置为true，则只允许选择一行。
        rownumbers: true,//当设置为true，则显示一个行号列。
        url: '/UserInfo/UserInfoList',//url:设置能够返回JSON数据的Action所对应的路径
        columns: [[
            { field: 'UserID', title: '用户编号', width: 100, align: "center" },
            { field: 'UserName', title: '用户姓名', width: 100, align: "center" },
            { field: 'LoginName', title: '登录名', width: 100, align: "center" },
            { field: 'UserSex', title: '性别', width: 100, align: "center" },
            { field: 'UserPhone', title: '手机号', width: 100, align: "center" },
            { field: 'UserEmail', title: '邮箱账号', width: 150, align: "center" },
            { field: 'UserLevel', title: '用户级别', width: 150, align: "center" },
            { field: 'UserPoint', title: '当前积分', width: 150, align: "center" },
            { field: 'UserState', title: '用户状态', width: 150, align: "center" },
            {
                field: 'UserCreateTime', title: '创建时间', width: 150, align: "center",
                formatter: function (value, row, index) {
                    return createTime(value);
                }
            }
        ]]
    });


    //多条件查询
    $('#btn_Search').click(function () {

        //向服务端发送请求参数
        $('#dg_User').datagrid('load', {
            UserID: $.trim($("#txt_ID").val()),
            UserName: $.trim($("#txt_userName").val()),
            UserPhone: $.trim($("#txt_userPhone").val()),
            UserLevel: $("#Userlevel").val(),
            UserSex: $("#sel_Sex").val(),
        });
    });

    //添加信息
    $('#btn_Create').click(function () {
        //弹出对话框
        $('#dlg').dialog({
            title: '添加学员信息',
            width: 600,
            height: 320,
        }).dialog("open");

        //给iframe的src属性赋值
        $("#frm1").attr("src", "/UserInfo/Add");
    });

    //修改信息
    $('#btn_Edit').click(function () {
        //1.判断用户是否选中一行，如果选中弹出编辑框，否则提示用户
        var row = $("#dg_User").datagrid("getSelected");
        if (row == null ) {
            //没有选中，弹出对话框提示用户
            $.messager.alert('温馨提示', '请选择要编辑的行', 'warning');
        }
        else
        {
            ////设置断点
            //console.log(row);

            //弹出对话框
            $('#dlg').dialog({
                width: 600,
                height: 320,
            }).dialog("open").dialog("setTitle","修改学员信息");

            //给iframe的src属性赋值
            $("#frm1").attr("src", "/UserInfo/Edit?id=" + row.ID);
        }
    });


    //删除信息
    $('#btn_Delete').click(function () {
        //1.判断用户是否选中一行，如果选中提示用户是否要删除，否则提示用户选中一行
        var row = $("#dg_User").datagrid("getSelected");
        if (row == null) {
            //没有选中，弹出对话框提示用户
            $.messager.alert('温馨提示', '请选择要编辑的行', 'warning');
            return;
        }

        //提示用户是否要删除
        $.messager.confirm('确认', '您确认想要删除记录吗？', function (r) {
            if (r) {
                //2.如果确定要删除，向服务端发送Ajax异步请求
                $.post("@Url.Action("Delete","UserInfo")", { deleteId: row.ID }, function (data) {

                    //根据返回的结果，如果成功提示用户
                    if (data.State == 1) {

                        //提示信息
                        $.messager.alert('温馨提示', data.Message, 'info');

                        //刷新列表
                        $('#dg_User').datagrid('reload');
                    }
                    else
                    {
                        //提示信息
                        $.messager.alert('温馨提示', data.Message, 'error');
                    }


                }, "json");
            }
        });

    });
</script>


